/**
 * Created by oiuyt on 2018/7/18.
 */
import React, { Component } from 'react';
import { Redirect,Prompt} from 'react-router-dom'
class Test5 extends Component {
/*
    调用super的原因：在ES6中，在子类的constructor中必须先调用super才能引用this
    super(props)的目的：在constructor中可以使用this.props
    */
    constructor(props) {
        super(props)
        this.state = { dirty: false }
        this.onInput = this.onInput.bind(this)
    }

    onInput(e){
        const isShow = !!e.target.value.trim()
        this.setState({ dirty: isShow })
    }

/****
 react-router-dom在页面中的应用
**/
    render() {
        //if(true)
        //{
        //    return (     <Redirect to="/test4/test6"/>    )
        //}
        return (
            <div>
                <h1>Form</h1>
                <input type="text" onInput={this.onInput} />
                <Prompt
                    when={this.state.dirty}
                    message="数据尚未保存，确定离开？" />
            </div>
        )
    }
}


export default Test5
